@charset "utf-8";

@top_height: 60px;
@left_width: 220px;
@bar_height: 40px;
@form_item_height: 32px;
@aside_width: 100px;
@header_height: 50px;

@font-color: #606266;
@white: #ffffff;
@black: #000000;
@green: #39b54a;
@dark_blue: #2b63b0;
@light_blue: #2b75ca;
@blue: #409efe;
@blueOpacity: #dbeaf9;
@red: #dd2f1e;
@chinaRed: #aa381e;
@red_orange: #f12e07;
@dark_gold: #f7f1e4;
@orange: #f78e1e;
@seablue: #70db93;
@brass: #b5a642;
@brightGlod: #d9d919;
@coldCopper: #d98719;
@gray_bg: #f8f8f8;
@gray_33: #333333;
@gray_44: #444;
@gray_55: #555;
@gray_66: #666666;
@gray_99: #999999;
@gray_c6: #c6c6c6;
@gray_d6: #d6d6d6;
@gray_e4: #e4e4e4;
@gray_e6: #e6e6e6;
@gray_ee: #eee;
@gray_f1: #f1f1f1;
@gray_f5: #f5f5f5;
@gray_f8: #f8f8f8;
@gray_f9: #f9f9f9;
@gray_hover: #486582;
@foot_bg: #eceef0;

/*颜色*/
@themeColor: #1951be;
@themeDarkColor: #1649ab;
@themeBlueColor: #0099ff;
@themeDarkBlueColor: #3a6b99;
@themeGreenColor: #39b54a;
@themeDarkGreenColor: #108c53;
@themeOrangeColor: #f78e1e;
@themeDarkOrangeColor: #d26b21;
@themeRedColor: #dd4b39;
@themeDarkRedColor: #a94442;
@themeLightRedColor: #f5555f;
@borderColor: #eee;

.block(@block: block, @w: 100%, @h: 100%) {
  display: @block;
  width: @w;
  height: @h;
}

.radius(@n: 0.3em) {
  -webkit-border-radius: @n;
  -moz-border-radius: @n;
  border-radius: @n;
}

.boxShadow(@x: 0px, @y: 0px, @w: 0px, @color) {
  -webkit-box-shadow: @x @y @w @color;
  -moz-box-shadow: @x @y @w @color;
  -o-box-shadow: @x @y @w @color;
  box-shadow: @x @y @w @color;
}

.boxShadowInset(@x: 0px, @y: 0px, @w: 0px, @color) {
  -webkit-box-shadow: inset @x @y @w @color;
  -moz-box-shadow: inset @x @y @w @color;
  -o-box-shadow: inset @x @y @w @color;
  box-shadow: inset @x @y @w @color;
}

.transform(@style) {
  //rotate(0deg),translate(x,y),skew(x:0deg,y:0deg)
  -webkit-transform: @style;
  -moz-transform: @style;
  -ms-transform: @style;
  -o-transform: @style;
  transform: @style;
}

.transition(@style: all, @duration: 0s, @timing: linear, @delay: 0s) {
  -webkit-transition: @arguments;
  -moz-transition: @arguments;
  -ms-transition: @arguments;
  -o-transition: @arguments;
  transition: @arguments;
}

.animation(@name, @duration, @timing: ease, @delay: 0s, @count: 1) {
  //infinite    direction方向-alternate（来回）-normal（单向）
  -webkit-animation: @arguments;
  -moz-animation: @arguments;
  -ms-animation: @arguments;
  -o-animation: @arguments;
  animation: @arguments;
}

.comTranstion(@time:0.3s) {
  -webkit-transition: all @time;
  -moz-transition: all @time;
  -ms-transition: all @time;
  transition: all @time;
}

.linearGradient(@direction:135deg,@color1:#2b63b0,@color2:#0578e5) {
  background-image: -moz-linear-gradient(@direction, @color1, @color2);
  background-image: -webkit-gradient(@direction, @color1, @color2);
  background-image: -o-gradient(@direction, @color1, @color2);
  background-image: linear-gradient(@direction, @color1, @color2);
}
.linearGradient2(@direction:135deg,@color1:#2b63b0,@color2:#0578e5,@color3) {
  background-image: -moz-linear-gradient(@direction, @color1, @color2, @color3);
  background-image: -webkit-gradient(@direction, @color1, @color2, @color3);
  background-image: -o-gradient(@direction, @color1, @color2, @color3);
  background-image: linear-gradient(@direction, @color1, @color2, @color3);
}

.opacity(@m: 0) {
  filter: alpha(opacity= @m);
  -moz-opacity: @m / 100;
  -khtml-opacity: @m / 100;
  opacity: @m / 100;
}

.absolute(@w: 100%, @h: 100%, @top: 0, @left: 0) {
  position: absolute;
  width: @w;
  height: @h;
  top: @top;
  left: @left;
}
.box-sizing(@c) {
  -webkit-box-sizing: @c;
  -moz-box-sizing: @c;
  box-sizing: @c;
}
